<template>
    <div class="login">
        <div class="halfBottom">
            <div class="wangyi">
            </div>
            <div class="buttonn">
                <button class="one" @click="goiphone">
                    <span class=" iconfont icon-shouji_o-copy one1"></span>
                    <span class=" one1">手机号快捷登陆</span>
                </button>
                <button class="one two">
                    <span class=" iconfont icon-youxiang one1 two1"></span>
                    <span class=" one1 two1" @click="gomail" >邮箱账号登陆</span>
                </button>
            </div>
        </div>
    </div>
</template>

<script setup lang="ts">
import { useRouter } from 'vue-router'
const router=useRouter()// 路由信息对象
const goiphone = () =>{
    router.push('/goiphone')
}
const gomail = () =>{
    router.push('/gomail')
}

</script>

<style scoped>
.wangyi {
    height: 115px;
    width: 100%;
    background: url(../../../assets/网易.png) no-repeat 110px 60px;
    background-size: 140px;
    margin-bottom: 50px;
}

.login {
    height: 100vh;
    background-color: #f2f5f4;
    position: relative;
}

.one {
    background-color: #dd1a21;
    border-radius: 3%;
    border: 0px;
    height: 47px;
    width: 340px;
    display: flex;
    justify-content: center;
    align-items: center;

}

.one1 {
    display: block;
    color: #fffff1;
    padding-left: 5px;
    font-size: 15px;

}

.buttonn {
    height: 125px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;

}

.two {
    background-color: #f2f5f4;
    border: 1px #e21a21 solid;
}

.two1 {
    color: #e21a21;
}
</style>